<template>
  <div class="gl_heightFull">
    <el-tabs v-model="activeName" type="card" class="gl_tabs">
      <el-tab-pane v-for="(item, index) in orgnazitionAuthTabs" :key="index" :label="item.title" :name="item.code">
        <component :is="item.components" v-if="item.code === activeName" :delegation-id="delegationId" :team-info="userTeamInfo" :organization-units-types="organizationUnitsTypes" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex';

import globalConfig from './components/globalConfig';
import customConfig from './components/customConfig';

import {
  api_GET_EventsManagementDelegationId // 获取团体注册信息
} from '@/extend/api/gameswaggerApi/app.js';

import {
  api_GET_OrganizationUnitsTypes // OrganizationUnit
} from '@/extend/api/swaggerApi/identity.js';

export default {
  components: {
    globalConfig,
    customConfig
  },
  data () {
    return {
      activeName: 'globalConfig',
      orgnazitionAuthTabs: [
        {
          code: 'globalConfig',
          title: '全局设置',
          components: 'globalConfig'
        },
        {
          code: 'customConfig',
          title: '个性化设置',
          components: 'customConfig'
        }
      ],
      delegationId: '',
      userTeamInfo: {},
      organizationUnitsTypes: [] // 机构等级字典
    };
  },
  computed: {
    ...mapState({
      UserType: state => state.user.currentUserType
    })
  },
  watch: {
    'UserType': {
      immediate: true,
      deep: true,
      handler(val) {
        if (val && val.delegationId) {
          this.delegationId = val.delegationId;
          this.getUserTeamInfo();
        }
      }
    }
  },
  created() {
    this.getDict();
    this.getDictByType(['district']);
    this.getOrganizationUnitsTypes();
  },
  methods: {
    ...mapActions({ getDict: 'dict/getDict', getDictByType: 'dict/getDictByType' }),
    getUserTeamInfo() {
      api_GET_EventsManagementDelegationId(this.delegationId)
        .then(res => {
          this.userTeamInfo = res;
          console.log('getUserTeamInfo -> userTeamInfo', res);
        })
        .catch(
          error => {
            this.$message({ type: 'error', message: `获取团体信息失败 ${error.error.message}` });
          }
        );
    },
    // 获取机构等级字典
    getOrganizationUnitsTypes () {
      api_GET_OrganizationUnitsTypes()
        .then(res => {
          this.organizationUnitsTypes = res.items;
        })
        .catch(
          error => {
            this.$message({ type: 'error', message: `获取机构等级失败 ${error.error.message}` });
          }
        );
    }
  }
};
</script>
